*{
    padding: 0;
    margin: 0;
}
.wrapper{
    width: 100%;
    height: 100%;
}
.of-a{
    overflow: auto;
}
.box-400-60{
    width: 400px;
    height: 60px;
}
.box-800-100p{
    width: 800px;
    height: 100%;
}
.box{
    width: 200px;
    height: 100%;
    float: left;
}
.box-100p-100p{
    width: 100%;
    height: 100%;
}
.h100p{
    height: 100%;
}
.w100p{
    width: 100%;
}
.fl{
    float: left;
}
.fr{
    float: right;
}
.df{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
}
.f1{
    flex:1;
}
.flex-shrink0{
    flex-shrink:0;
}
.bg-blue{
    background-color: blue;
}
.bg-red{
    background-color: red;
}
.bg-green{
    background-color: green;
}
.bg-yellow{
    background-color: yellow;
}